<template>
	<view class="login">
		
		<view style="padding:10upx 40upx;font-size: 30upx;color:#A22C32;">
			提示：留言应简短和谐，如果需要求购也可电话联系该发帖者！
		</view>
		
		<input type="text"  class="inputStyle" placeholder="留言" :value="content" @input="inputChange"  data-key="content"/>
		
		<button type="" class="buttonStyle" style="margin-bottom: 20upx;" @click="adddata">提交</button>
		
		
		
<!-- 		<view class="titleLine" >历史留言</view>
 -->		
		
		
		<view style="font-size: 26upx;color: #a0a0a0;margin-top: 10upx;"
		 v-for="(item, index) in dlist" :index="index" :key="index"  >
			<view style="text-align: center;margin: 10upx 0;">
				{{item.addtime}}
			</view>
			<view style="border-radius: 10upx;padding: 20upx 40upx;background-color: #e5f2f2;margin: 10upx 20upx;">
				<view>[{{item.nickName}}]<text style="padding-left: 10upx;">{{item.content}}</text></view>
				
			
				
			</view>
		</view>
		
		
	
		
	</view>
	
	
	
</template>

<script>
	export default {
		data() {
			return {
					uid:uni.getStorageSync('userInfo').uid,
					pid:0,
					content:null,
					dlist:[]
			}
		},
		onLoad(option) {
			this.pid=option.id;
			uni.startPullDownRefresh();
		},
		onShow() {
			uni.startPullDownRefresh();
		},
		onPullDownRefresh() {
		        //监听下拉刷新动作的执行方法，每次手动下拉刷新都会执行一次
		        //console.log('refresh');
				
				
				this.loadData();
		        setTimeout(function () {
		            uni.stopPullDownRefresh();  //停止下拉刷新动画
		        }, 1000);
		},
		methods: {
			loadData()
			{
				const sendData = {
					"pid": this.pid
					
				};
				
					uni.request({
						url: this.userApi+'/discuss', //仅为示例，并非真实接口地址。
						data: sendData,
						dataType: 'json',
						method: 'get',
						header: {
							'content-type': 'application/json' // 微信默认就是
						},
						success: res => {
							console.log(res);
							if (res.statusCode !== 404) {
								console.log(res.data );
								
								this.dlist=res.data;
								
							} else {
								this.list='';
								console.log("数据没有");
							}
						}
					});
				
			},
			inputChange(e){
				const key = e.currentTarget.dataset.key;
				this[key] = e.detail.value;
			},
			adddata(){
					
					if(this.content==null){
						uni.showModal({
							title: "不能有空值",
							content: "不能有空值！",
							showCancel: false,
							confirmText: "确定"
						})
						return;
					}
					
					const sendData = {
						"uid": this.uid,
						"content":  this.content,
						"pid":this.pid
						
					};
					
						uni.request({
							url: this.userApi+'/adddiscuss',
							data: sendData,
							dataType: 'json',
							method: 'POST',
							header: {
								//'content-type': 'application/json' // 微信默认就是
								'content-type': 'application/x-www-form-urlencoded' // 微信默认就是
								
							},
							success: res => {
								console.log(res.data );
								
								if (res.statusCode !== 404) {
									
									uni.showModal({
										title: "操作成功",
										content: "操作成功！",
										showCancel: false,
										confirmText: "确定",
										   success: function (res) {
										        if (res.confirm) {
													
													uni.startPullDownRefresh();
													
													
												} else if (res.cancel) {
										            console.log('用户点击取消');
										        }
										    }
									})
									
									
								} else {
									
									uni.showModal({
										title: "操作失败",
										content: "操作失败！",
										showCancel: false,
										confirmText: "确定"
									})
								}
							}
						});
					
					
					
					
				}
				
			
		}
	}
</script>

<style>
.login{position: absolute;top:0;left:0;right:0;bottom:0;background: #fff;padding-top: 20upx;}
.inputStyle{height: 96rpx;width: 660rpx;border:1rpx solid #dadada;font-size: 28rpx;
display: block;margin:0 auto;margin-bottom:40rpx;border-radius: 2px;text-indent: 15rpx;}
.inputStyle:focus{border:1rpx solid  rgb(211, 61, 62);}
.logo{width: 90%;margin:30rpx auto 60rpx;display: block;}
.buttonStyle{width: 660rpx;margin:0 auto;border-radius: 2px;background: rgb(211, 61, 62);
color: #fff;font-size: 28rpx;height: 90rpx;line-height: 90rpx;border:none;}
.forget{display: flex;justify-content: space-between;width: 660rpx;
margin:0 auto 100rpx;font-size: 28rpx;}
.forget text{color: rgb(211, 61, 62);}
.forget label {display: flex;align-items: center;}
.forget label image{width: 32rpx;height:32rpx;margin-right: 10rpx;}
.titleLine {
	padding-left: 20upx;
	background-color: #ebe8ee;
	font-weight: bold;
	font-size: 32upx;
	font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
	padding-top: 5upx;
	padding-bottom: 5upx;
}
</style>
